<template lang="pug">
div
  FixedScroll
    div(slot="fixed")
      PageHeader(pageTitle="电池扫码" :back="back")
        div(slot="right" @click="save" v-if="canScan") 确认

      ScanSearch(
          v-if="canScan"
          placeholder="序列号"
          :initSearchValue="searchValue"
          @search="search"
          @scan="search"
          )

    ColoredTable.table(
        slot="scroll"
        :headList="headList"
        :body="barcodeBody"
        :statusMap="statusMap"
        :isLoading="isLoading"
        @delete-row="deleteRow"
        )

</template>

<script>
import api from "$api"
import util from "$util"
import { mapState, mapGetters } from "vuex"

export default {
  data() {
    return {
      searchValue: "",
      isLoading: false,

      loading: {
        search: false,
      },

      headList: [
        { field: "delete-row", title: "", checked: true },
        { field: "BarcodeData", title: "序列号", checked: true },
        { field: "Qty", title: "数量", checked: true },
        { field: "PartNo", title: "物料号", checked: true },
        { field: "PartName", title: "物料名称", checked: true },
      ],
    }
  },
  computed: {
    ...mapState({
      index: state => state.scanMove.index,
      canScan: state => state.scanMove.canScan,
      codeMap: state => state.scanMove.codeMap,
      scanPageInfo: state => state.scanMove.info,
      scanPageBody: state => state.scanMove.body,
      barcodeBody: state => state.scanMove.barcodeBody,
      statusMap: state => state.scanMove.statusMap,
      active: state => state.scanMove.active,
    }),
  },
  watch: {
    active(v) {
      // 切换tab时要重新绑定手机上的扫描键
      if (v === "BarcodeInfo") {
        this.$forceUpdate()
        if (this.canScan) {
          this.registerScanner()
        } else {
          if (this.barcodeBody.list.length === 0) {
            this.getBatteryList()
          }
        }
      }
    },
  },
  methods: {
    async search(value) {
      if (this.loading.search) {
        return
      }
      if (value === "") {
        return
      }
      // 电池码里可能包含逗号，取逗号前面的部分
      var commaIndex = value.indexOf(",")
      if (commaIndex > -1) {
        value = value.substring(0, commaIndex)
      }

      // 已扫过的电池不能再扫
      if (this.codeMap[value]) {
        return
      }

      this.loading.search = true
      try {
        let row = this.scanPageBody.list[this.index]
        let data = await api.StockMoveGetInfo({
          BarcodeData: value,
          TranId: this.scanPageInfo.TranId,
          TranDetailId: row.TranDetailId,
        })

        let IsBatch = row.IsBatch
        if (IsBatch === 1) {
          util.Alert(`物料${data.PartNo}维护的管理模式错误，请维护库位物料关系数据后操作`, "错误")
          return
        }

        let status = ""
        if (row.PartNo === data.PartNo) {
          status = util.STATUS_OK
        } else {
          status = util.STATUS_ERROR
        }
        data["delete-row"] = true

        // 添加一行数据
        let self = this
        this.$store.commit("scanMove/addBarcode", {
          vue: self,
          data,
          status,
        })

      } catch(err) {
        this.$root.error(err)
      } finally {
        this.isLoading = false
        this.loading.search = false
      }
    },

    // 点击返回图标时返回扫单据页面
    back() {
      this.$store.commit("scanMove/selectTab", {
        tab: "ScanPage",
      })
    },

    save() {
      util.Toast("保存成功")
    },

    // 删除一行
    deleteRow(barcode) {
      let self = this
      this.$store.commit("scanMove/deleteBarcode", {
        vue: self,
        barcode,
      })
    },

    // 获取已存在的电池列表
    async getBatteryList() {
      this.isLoading = true
      try {
        let list = await api.GetBatteryList({
          TranNo: this.scanPageInfo.TranNo,
          DetailId: this.scanPageBody.list[this.index].TranDetailId,
          Status: this.scanPageInfo.TranStatus,
          BillType: this.scanPageInfo.TranType,
          ModelName: "Tran",
        })
        this.$store.commit("scanMove/setBatteryCache", {
          list,
        })
      } catch(err) {
        this.$root.error(err)
      } finally {
        this.isLoading = false
      }
    },

    registerScanner() {
      util.registerScanner((data) => {
        this.searchValue = data
        this.search(data)
      })
    },
  },
}
</script>

<style lang="stylus" scoped>

.table
  scan-table()

</style>
